// 从vuex插入中导入cerateStore函数
import { createStore } from "vuex";

// 配置vuex的公共数据、公共函数等模块选项
// 配置vuex的5个核心概念
const store = createStore({
    // 存储公共数据的对象,类似于vue里的data
    state :{
        // 人员信息组
        plist : [],
    },

    // 共同的:mutations和actions存储操作函数
    // 区别:mutations存储的同步函数(函数一个个按顺序执行),只有此处的函数才能直接修改state存储的数据
    // 所有同步函数都必须设置第一个参数state,其它参数可选
    mutations:{
        // 添加数据的函数,state公共数据,obj组件提交过来的数据
        addlist(state , obj){
            // 将数据提交给state里面的plist完成添加操作
            state.plist.push(JSON.parse(JSON.stringify(obj)));
            alert('添加成功')
        }, 
         // 删除state的数据
        dellist(state , i){
        state.plist.splice(i,1);
        },
         // 替换新数据
        editlist(state , datas){
            let i =Number(datas.id);
            state.plist[i] = JSON.parse(JSON.stringify(datas.val));
        }
    },

    // 区别:actions存储的异步函数(同时执行多个函数),不具备修改state对象的数据,只能作为调用mutations函数的接口
    actions :{ },

    // 存储对state的数据加工,类似于computed计算机属性(如state存储了时间数,getter加工成日期格式数据)
    // 不影响原来数据,只是显示的时候进行优化
    getters : {},

    //模块,一般用于大型项目的功能划分.登录/注册/忘记密码等于用户信息相关的数据划分一个user模块
    // 每一个独立的模块下,可以重新设置5个核心概念
    modules : {} 
});
// 导出
export default store;